<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap core CSS -->
<link rel="stylesheet" type="text/css"
	href="../../bootstrap-3.3.7/dist/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css"
	href="../../bootstrap-3.3.7/dist/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/index.css" />
<link rel="stylesheet" type="text/css" href="../../css/personal.css" />
<link rel="stylesheet" type="text/css" href="../../css/background.css" />
<link rel="stylesheet" type="text/css" href="../../css/bootstrapValidator.min.css" />
<link rel="stylesheet" type="text/css" href="../../css/upload/fileinput.css" />

<!--上传图片  -->

<script type="text/javascript"
	src="../../bootstrap-3.3.7/dist/js/jquery.min.js"></script>
<script type="text/javascript"
	src="../../bootstrap-3.3.7/dist/js/bootstrap.js"></script>
<script type="text/javascript" src="../../js/upload/fileinput.js"></script>
<script type="text/javascript" src="../../js/upload/zh.js"></script>
<script type="text/javascript" src="../../js/bootstrapValidator.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link  href="../../bootstrap-3.3.7/docs/assets/css/ie10-viewport-bug-workaround.css"
	rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<script type="text/javascript">
var previd = '${permissionlist[0].permissionid}';
	$(function(){
		 $("#refresh").load('${permissionlist[0].permissionurl}?tmp='+Math.random());//这里也可以请求后台加载页面
	});
	function tabpanel(value,url){
		var id = value.parent().attr('id');//获取父元素id
		$("#"+previd).removeClass("active");
		$("#"+id).addClass("active");
		previd = id;
		$("#refresh").load(url);//这里也可以请求后台加载页面
	} 
</script>
</head>
<body>
	<div class="container">
		<div class="row clearfix">
			<div class="col-md-12" style="padding-bottom: 10px">
				<%@include file="../common/header.jsp"%>
			</div>
		</div>
		<div class="row clearfix">
			<div class=" col-md-3 column sidebar">
				<div class="panel panel-default" style="height: 780px">
					<div class="panel-body">
						<ul class="nav nav-sidebar">
							<c:forEach items="${permissionlist}" var="permissioninfo" varStatus="vs">
								<c:choose>
								<c:when test="${vs.first}">
									<li id='${permissioninfo.permissionid}' class="active"><a onclick="tabpanel($(this),'${permissioninfo.permissionurl}')">${permissioninfo.permissionname}</a></li>
								</c:when>
								<c:otherwise>
									<li id='${permissioninfo.permissionid}'><a onclick="tabpanel($(this),'${permissioninfo.permissionurl}')">${permissioninfo.permissionname}</a></li>
								</c:otherwise>
								</c:choose>
							</c:forEach>
						</ul>
					</div>
				</div>
			</div>
			<div class="col-md-9" id="refresh">
			</div>
		</div>
		<div class="row clearfix">
			<div class="col-md-12" style="padding-bottom: 10px">
				<%@include file="../common/bottom.jsp"%>
			</div>
		</div>
	</div>
	
	
</body>
</html>